<template>
	<view class="app-card">
		<view @click="choose(index)" :key="index" v-for="(item,index) in problem">
			<myredio :checked="state[index]" :padding="10" :title="item" />
		</view>
	</view>
</template>

<script>
const problem = [
		'1.有用无用未区分，需要整理',
	    '2.设备摆放未定位，需要整顿',
	    '3.地面桌面有垃圾，需要清扫',
	    '4.设备设施有故障，需要报修',
	    '5.用电用水有隐患，需要警示',
	    '6.耗材使用有浪费，需要节约',
	    '7.实训环境保持好，给予表扬',
	];
const field = ['arrange','rectify','clear','repair','safe','economize','praise']
const state = [false, false,false,false, false,false,false]
import myredio from '../../../components/radio.vue'
export default{
	props:['resObj'],
	data(){
		return {
			problem,
			state,
			field,
			res:{}
		}
	},
	mounted() {
		const newstate = this.state.map( ele => false)
		this.state = newstate;
		if(Object.keys(this.resObj).length > 0){
			const newstate = [];
			this.field.forEach( ele => {
				for (let s in this.resObj) {
					if(ele === s){
						newstate.push(this.resObj[ele])
						return
					}
				}
			})
			this.state = newstate;
		}
		this.createres()
	},
	methods:{
		choose(index){
			this.state[index] = !this.state[index]
			this.createres()
			this.$emit('change',this.res)
			this.$forceUpdate()
		},
		createres(){
			this.field.forEach( (ele,index) => {
				this.res[ele] = this.state[index]
			})
		}
	},
	
	components:{
		myredio
	}
}
</script>

<style>
</style>
